@charset "utf-8";
@import "common/reset";
@function r($px){
    @return $px/100+rem;
}
*{
    margin: 0;
    padding:0;
    text-decoration: none;
    list-style: none;
}
.mobile{
    section{
        font-size: 0;

        .title{
            padding: 0 r(30);
            
            h1{  
                font-size: r(30);
            }
             h2{ 
                font-size: r(30);
            }
        }
       .watch{
           overflow: hidden;
          margin-top: r(15);
           .hear{
               width: r(21);
               height: r(19);
                float: right;
                margin-top: r(4);
               
               img{
                   width: 100%;
               }
       }
       h1{  font-weight: normal;
           font-size: r(20);
           color: #c5c5c5;
            float: right;
            margin-right: r(44);
            margin-left: r(7);
       }
    
       .look{
           width: r(24);
               height: r(14);
                float: right;
            margin-top: r(6);
           img{
                width: 100%;
           }
       }
       h2{
           margin-left: r(7);
            margin-right: r(31);
          font-size: r(20);
           color: #c5c5c5;
           float: right;
       }
    }
    .date{
      overflow: hidden;
        margin-right: r(31);
        h1{  font-weight: normal;
            font-size: r(22);
        color: #c5c5c5;
        float: right;
            span{
                font-size: r(22); 
                color: #b20000;
                 margin-left: r(17);
            }
        }
    }
    .Abstract{
        margin-left: r(31);
        margin-top: r(43);
        p{
            font-size: r(20);
            color: #8b8b8b; 
        }
        p:first-child{
               text-indent: 1.5em;
            }
    }
    .title2{
        padding: 0 r(31);
        margin-top: r(37);
        h1{  font-weight: normal;
           font-size: r(20); 
          text-indent: 2em;
        }
        h2{  font-weight: normal;
            font-size: r(20);  
        }
    }
    .web{
        margin-top: r(36);
        margin-left: r(31);
        p{
            font-size: r(20);
            color: #8b8b8b; 
        }
        p:first-child{
               text-indent: 1em;
            }
    }
    .slogan{
         margin-top: r(36);
        h1{  font-weight: normal;
            font-size: r(20);
            margin-left: r(67);
        }
    }
    .consumer{
        margin-top: r(36);
         margin-left: r(31);
        p{
           font-size: r(20);
            color: #8b8b8b;   
        }
         p:first-child{
               text-indent: 2em;
            }
    }
    .sky-sea{
         margin-top: r(43);
        margin-left: r(31) ;

        width: r(580);
        height: r(271);
        img{width: 100%;}
    }
    .title3{
        text-align: center;
        h1{  font-weight: normal;
           font-size: r(20);  
        }
    }
    .young{
        margin-left: r(31);
        margin-top: r(36);
        p{
          font-size: r(20);
            color: #8b8b8b; 
               
        }
        p:nth-child(1){
            margin-left: r(43);
        }
    } 
    .image{
        margin-top: r(15);
        margin-left: r(20);
           width: r(592);
           height: r(167);
           img{
               width: 100%;
           }
       }
       .strat{
           margin-top: r(24);
           margin-left: r(31);
           h1{  font-weight: normal;
               font-size: r(20);
               margin-left: r(49);
           }
           h2{
               font-size: r(20);
               color: #8b8b8b;
                font-weight: normal;
           }
       }
      .img{
          margin-top: r(20);
          margin-left: r(31);
          margin-bottom: r(24);
          width: r(592);
          height: r(274);
          img{
              width: 100%;
          }
      }
      .activity{
          h1{  font-weight: normal;
              font-size: r(20);
              margin-left: r(31);
          }
          h2{
              margin-bottom:r(36);
              margin-top:r(36);
              font-weight: normal;
              font-size: r(20); 
              color: #8b8b8b;
              margin-left: r(42);
          }
          h3{
              font-weight: normal;
              font-size: r(20); 
              color: #8b8b8b; 
               margin-left: r(31);
          }
      }
      .time{margin-top:r(36);
          h1{
            font-weight: normal;
              font-size: r(20);
              margin-left: r(31);  
          }
          h2{
              font-weight: normal;
              font-size: r(20); 
              color: #8b8b8b;
              margin-left: r(31);
          }
          h2:nth-child(2){
              margin-bottom:r(36);
              margin-top:r(36);
          }
      }
      .plant{
          margin-top: r(26);
          margin-bottom: r(36);
          width: r(583);
          height: r(170);
          margin-left: r(31);
          img{
              width: 100%;
          }
      }
      .adv{
          p{
              font-size: r(20); 
              color: #8b8b8b;
              margin-left: r(31);
               
          }
      }
      .shake{
          overflow: hidden;
          width: r(582);
          height:r(141);
          margin-left: r(31);
          margin-bottom: r(25);
          img{
              width: 100%; 
          }
      }
      .reward{
          p{
              margin-left: r(31);
              font-size: r(20); 
              color: #8b8b8b;
          }
         p:nth-child(3){
             margin-top:r(36) ;
         }
         p:nth-child(4){
             margin-top:r(36) ;
         }
         p:nth-child(5){
             margin-top:r(36) ;
         }
      }
      .rebbag{
          overflow: hidden;
          width: r(581);
              height: r(229);
          img{
              width: 100%;
          }
      }
      .summary{
          p{margin-top: r(27);
          margin-bottom: r(29);
              margin-left: r(31);
               font-size: r(20); 
              color: #8b8b8b;
          }
      }
      .layout{
          margin-left: r(20);
          margin-bottom: r(84);
          width: r(527);
          height: r(277);
          img{
              width: 100%;
          }
      }
      .bg{
          border-top: r(19) solid #efefef;
          border-bottom: r(19) solid #efefef;
          height: r(81);
          width: 100%;
          padding-top: r(4.5);
          a{
             
              span{
                  font-size: r(21);
                  color: #727171;
              }
              i{
                  font-style: normal;
                  font-size: r(18);
                  color: #727171;
              }
          }
      }
      .image1{
          text-align: center;
          margin-top: r(38);
          margin-bottom: r(53);
          a:nth-child(1){
              display: inline-block;
             p:nth-child(1){
                   width: r(72);
                   height: r(72);
                   img{
                       width: 100%;
                   }
               }
              p:nth-child(2){
                  font-size: r(20);
                  color: #8b8b8b;
                   text-align: center;
                   margin-top: r(8);
              }
          }
           a:nth-child(2){
               margin-left: r(55);
               margin-right: r(55);
               display: inline-block;
               p:nth-child(1){
                   width: r(72);
                   height: r(72);
                   img{
                       width: 100%;
                   }
               }
              p:nth-child(2){
                  font-size: r(20);
                  color: #8b8b8b;
                   text-align: center;
                    margin-top: r(8);
              }
              }
               a:nth-child(3){
                   display: inline-block;
             p:nth-child(1){
                   width: r(72);
                   height: r(72);
                   img{
                       width: 100%;
                   }
               }
              p:nth-child(2){
                  font-size: r(20);
                  color: #8b8b8b;
                   text-align: center;
                    margin-top: r(8);
              }
          }
          
      }
      .Comment{
         
          margin: 0 r(30);
          width: r(583);
          height: r(193);
          border:r(1)solid #c9c9c9;
          text-align: center;
         line-height: r(193);
          a{
              text-decoration: underline;
              color: #b20000;
              font-size: r(20);
              margin-right: r(6);
          }
          span{
               font-size: r(20);
               color: #8b8b8b;
          }
         
      }
      .sub{
         
         margin-left: r(123);
         margin-top: r(16);
          a{ 
              display: inline-block;
             width: r(395);
          height: r(53);
          background: #b20000;
          text-align: center;
          border: r(1)solid #b20000;
              color: white;
              font-size: r(20);
              line-height: r(53);
          }
      }
      .three{
            margin-left: r(34);
          margin-top: r(50);
          margin-bottom: r(27);
          p{
              font-size: r(18);
              color: #727171;
          }
      }
      .Head-portrait{
          overflow: hidden;
        margin-left: r(34);
           .good{
              width: r(50);
              height: r(50);
             float: left;
             margin-right: r(12);
              img{
                  width: 100%;
              }
          }
          i{
              font-size: r(18);
              color: #444444;
             font-style: normal;
             float: left; 
             margin-top: r(10);
          }
          span{
              margin-left: r(9);
              margin-top: r(13);
              font-size: r(18);
              color: #b2b2b2;
              float: left;
          }
      }
      .years{
          overflow: hidden;
            margin-left: r(47);
          p{
              font-size: r(22);
              color: #444444;
              float: left;
              
          }
          h1{
              font-size: r(18);
              font-weight: normal;
              color: #b2b2b2;
              float: right;
              margin-right: r(54);
          }
      }
      .reply{
          overflow: hidden;
          margin-top: r(20);
          span{
               float: right;
              font-size: r(19);
              color: #444444;
          }
          em{
               float: right;
            font-style: normal;
              font-size: r(19);
               color: #444444;
          }
          .gt{
              
             float: right;
             margin-top: r(10);
          }
      }
      .backg{
          background: #fafafa;
          width: r(535);
         margin: 0 auto;
        overflow: hidden;
          .one{margin: 0 r(30);
         padding-top: r(19);
           overflow: hidden;
           border-bottom: r(1) dashed #c9c9c9;
           padding-bottom: r(14);
              .mino{
                  width: r(40);
                  height: r(40);
                  float: left;
                  img{
                     width: 100%;
                  }
              }
              h1{
                  font-size: r(18);
                  color: #444444;
                  font-weight: normal;
                  float: left;
                  margin-top: r(4);
              }
              h2{
                   margin-top: r(4);
                  float: left;
                   font-size: r(18);
                  color: #444444;
                  font-weight: normal;
                  
              }
              .date-2{
            
              h3{
                   font-size: r(18);
              color: #b2b2b2;
              font-weight: normal;
              float: right;
              margin-top: r(53);
              }
          }
      }
 
           .two{margin: 0 r(30);
         padding-top: r(19);
             overflow: hidden;
                border-bottom: r(1) dashed #c9c9c9;
           padding-bottom: r(14);
              .mino-2{
                  width: r(40);
                  height: r(40);
                  float: left;
                  img{
                     width: 100%;
                  }
              }
              h1{
                  font-size: r(18);
                  color: #444444;
                  font-weight: normal;
                  float: left;
                  margin-top: r(4);
              }
              h2{
                   margin-top: r(4);
                  float: left;
                   font-size: r(18);
                  color: #444444;
                  font-weight: normal;
                  
              }
               h3{
                   margin-left: r(40);
                   margin-top: r(4);
                  float: left;
                   font-size: r(18);
                  color: #444444;
                  font-weight: normal;
                  
              }
              .date-3{
            
              h3{
                   font-size: r(18);
              color: #b2b2b2;
              font-weight: normal;
              float: right;
              margin-top: r(53);
              }
          }

          }
          .texta{
            
              margin-left: r(40);
              margin-top: r(20);
            textarea{  
                border:r(1)solid #c9c9c9 ;
              
            }
            
          }
          
          .pub{ 
            float: right;
            margin-right: r(40);
              a{
                   display: inline-block;
                     width: r(174);
              height: r(45);
            background: #b20000;
              color: white;
              text-align: center;
              line-height: r(45);
                  font-size: r(20);
                
              }
             
          }
      }
}
}